﻿
@{
    ViewBag.Title = "EmployeePageList";
    Layout = "~/Views/Shared/_LayoutMain.cshtml";
}
@section css{
    <link rel="stylesheet" href="~/assets/portal/assets/css/common.css" />
    <link rel="stylesheet" href="~/bussiness/js/base/reset.css" />
    <link rel="stylesheet" href="~/bussiness/js/pg/Performance/edit.css" />
    <style>

        #editor—wrapper {
            /*max-width: 90%;*/
            width: 1200px !important;
            border: 1px solid #ccc;
            z-index: 100; /*  按需定义 */
        }

        .title {
            font-weight: bolder;
        }

        #toolbar-container {
            border-bottom: 1px solid #ccc;
        }

        #editor-container {
            min-height: 310px;
            margin-bottom: 200px;
        }

            #editor-container .title::before {
                content: ""
            }

        .ant-select-arrow, .ant-select-clear {
            position: absolute;
            right: 10px;
        }

        .stitle {
            font-size: 16px;
            font-weight: 600;
            color: #424758;
            display: flex;
            align-items: center;
        }

            .stitle::before {
                content: "";
                margin-right: 10px;
                display: inline-block;
                width: 4px;
                height: 18px;
                background: #0064E5;
            }

        .stable {
            border-collapse: collapse; /* 折叠边框，使之变为单一线划分 */
            border: 1px solid #e1e5ea; /* 设置表格、表头、单元格边框 */
            width: 100%;
            margin-top: 10px;
            max-height: 800px;
            overflow-y: scroll;
        }

            .stable th {
                background: #f2f6f9;
                font-size: 14px;
                font-weight: 600;
            }

            .stable th, .stable td {
                border: 1px solid #e1e5ea; /* 设置表格、表头、单元格边框 */
                text-align: center;
                height: 48px;
            }

    </style>
}
<div id="EmergencyManagementEMCHECK" class="font-['SourceHanSansSC']">
    <a-style-provider hash-priority="high">
        <a-config-provider :locale="vlocale">
            <a-image :width="200"
                     :style="{ display: 'none',zIndex:100 }"
                     :preview="{visible:EmergencyManagementEMCHECKParams.previewShow.value,onVisibleChange:EmergencyManagementEMCHECKParams.setVisible}" :src="EmergencyManagementEMCHECKParams.imgUrl.value"></a-image>
            <m-pdf-pop-model></m-pdf-pop-model>
            <header class="px-5 box-border">
                <div class="flex items-center">
                    <div class="w-full h-[48px] text-[13px]  rounded-lg mx-auto my-[10px]  bg-white  text-[#888888] text-3xl flex items-center px-10">   <div class="w-22 h-22 bg-blue-200 mr-5"> <img class="w-full h-full cursor-pointer" v-on:click="EmergencyManagementEMCHECKParams.vvback()" src="~/Assets/nimgs/exit.png" alt="返回" /></div> <span class="text-[]">应急管理<span class="mx-2">/</span><span class="text-[#424758] text-[15px]">应急物资检查</span> </span>  </div>
                </div>
                <a-card :bordered="true" class="w-full  mt-12">
                    <template #title>
                        <div class="w-full flex justify-between items-center;">
                            <div class="flex items-center"> <div>应急物资检查</div> <div class="ml-7"></div></div>
                        </div>
                    </template>
                    <a-spin :spinning="EmergencyManagementEMCHECKParams.uploadLock.value" tip="加载中，请耐心等待..." />
                    <div class="stitle" style="margin:20px 0">基本信息</div>

                    <a-form style="margin-top:10px"
                            ref="FormRule"
                            layout="inline"
                            :rules="EmergencyManagementEMCHECKParams.rules.value"
                            :model="EmergencyManagementEMCHECKParams.formData.value">
                        @*<a-form-item label="物资内容：" name="SupplyName">
                            <a-input allow-clear placeholder="请输入物资内容" disabled v-model:value="EmergencyManagementEMCHECKParams.formData.value.SupplyName" style="width: 300px" />
                        </a-form-item>*@
                        <a-form-item label="提交人：">
                            <a-input disabled v-model:value="EmergencyManagementEMCHECKParams.formData.value.user" style="width:150px" />
                        </a-form-item>
                        <a-form-item label="提交日期：">
                            <a-input disabled v-model:value="EmergencyManagementEMCHECKParams.formData.value.time" style="width: 150px" />
                        </a-form-item>
                        <a-form-item v-if="EmergencyManagementEMCHECKParams.urlinfo.value.l==1" label="提交部门：">
                            <a-select show-search
                                      style="width:200px"
                                      :filter-option="EmergencyManagementEMCHECKParams.filterOption"
                                      placeholder="请选择部门"
                                      disabled
                                      v-model:value="EmergencyManagementEMCHECKParams.formData.value.DepartmentId"
                                      :options="EmergencyManagementEMCHECKParams.deptList.value">

                            </a-select>
                        </a-form-item>

                        <a-form-item label="季度信息：">
                            <a-select show-search
                                      style="width: 150px "
                                      :disabled="EmergencyManagementEMCHECKParams.urlinfo.value.type"
                                      :filter-option="EmergencyManagementEMCHECKParams.filterOption"
                                      placeholder="请选择季度"
                                      v-model:value="EmergencyManagementEMCHECKParams.sformData.value.Period"
                                      :options="EmergencyManagementEMCHECKParams.PeriodList.value">
                            </a-select>
                        </a-form-item>

                        <a-form-item label="年度：">
                            <a-select show-search
                                      style="width: 150px "
                                      :disabled="EmergencyManagementEMCHECKParams.urlinfo.value.type"
                                      :filter-option="EmergencyManagementEMCHECKParams.filterOption"
                                      placeholder="请选择年度"
                                      v-model:value="EmergencyManagementEMCHECKParams.sformData.value.Years"
                                      :options="EmergencyManagementEMCHECKParams.yearlist.value">

                            </a-select>
                        </a-form-item>
                    </a-form>
                    <a-form-item style="margin-top:10px" label-align="right" label="备注：">
                        <a-textarea style="width:600px" disabled v-model:value="EmergencyManagementEMCHECKParams.formData.value.Remark">
                        </a-textarea>
                    </a-form-item>
                    <div class="stitle" style="margin:20px 0">物资信息</div>
                    <a-card :bordered="true" class="w-full  mt-12">
                        <template #title>
                            <div class="w-full flex justify-between items-center;">
                                <div class="flex items-center"> <div>物资信息列表</div> <div class="ml-7"></div></div>
                                <a-button v-if="!EmergencyManagementEMCHECKParams.urlinfo.value.type" v-on:click="EmergencyManagementEMCHECKParams.allPass" type="primary">{{EmergencyManagementEMCHECKParams.flag.value==false?'一键检查':'一键取消'}}</a-button>
                            </div>
                        </template>
                        <table class="stable">
                            <tr>
                                <th>序号</th>
                                <th>厂区</th>
                                <th>物资名称</th>
                                <th>数量</th>
                                <th>单位</th>
                                <th>责任人</th>
                                <th>联系方式</th>
                                <th>保管位置</th>
                                <th>有效期</th>
                                <th v-if="!EmergencyManagementEMCHECKParams.urlinfo.value.type">第一季度</th>
                                <th v-if="!EmergencyManagementEMCHECKParams.urlinfo.value.type">第二季度</th>
                                <th v-if="!EmergencyManagementEMCHECKParams.urlinfo.value.type">第三季度</th>
                                <th v-if="!EmergencyManagementEMCHECKParams.urlinfo.value.type">第四季度</th>
                                <th>状态</th>
                                <th>备注</th>
                                <th>操作</th>
                            </tr>
                            <tr v-for="(e,i) in EmergencyManagementEMCHECKParams.settingList.value" :key="i">
                                <td>
                                    {{i+1}}
                                </td>
                                <td>
                                    <component :is="EmergencyManagementEMCHECKParams.renderTextWithTooltip(e.FactoryAreaName)" />
                                </td>
                                <td>
                                    <component :is="EmergencyManagementEMCHECKParams.renderTextWithTooltip(e.Name)" />
                                </td>
                                <td>
                                    <component :is="EmergencyManagementEMCHECKParams.renderTextWithTooltip(e.Quantity)" />
                                </td>
                                <td>
                                    <component :is="EmergencyManagementEMCHECKParams.renderTextWithTooltip(e.Unit)" />
                                </td>
                                <td>
                                    {{  e.Responsible}}
                                    @*  <component :is="EmergencyManagementEMCHECKParams.renderTextWithTooltip(e.Responsible)" />*@
                                </td>
                                <td>
                                    {{  e.Contact}}
                                    @*  <component :is="EmergencyManagementEMCHECKParams.renderTextWithTooltip(e.Contact)" />*@
                                </td>
                                <td>
                                    <component :is="EmergencyManagementEMCHECKParams.renderTextWithTooltip(e.Place)" />
                                </td>
                                <td>
                                    {{  e.ValidDate}}
                                    @*<component :is="EmergencyManagementEMCHECKParams.renderTextWithTooltip(e.ValidDate)" />*@
                                </td>
                                <td v-if="!EmergencyManagementEMCHECKParams.urlinfo.value.type">
                                    <a-tag v-if="e.Period_1==true" color="green">已检查</a-tag>
                                    <a-tag v-else>未检查</a-tag>
                                    @*<a-tag type="primary">未检查</a-tag>*@
                                </td>
                                <td v-if="!EmergencyManagementEMCHECKParams.urlinfo.value.type">
                                    <a-tag v-if="e.Period_2==true" color="green">已检查</a-tag>
                                    <a-tag v-else>未检查</a-tag>
                                </td>
                                <td v-if="!EmergencyManagementEMCHECKParams.urlinfo.value.type">
                                    <a-tag v-if="e.Period_3==true" color="green">已检查</a-tag>
                                    <a-tag v-else>未检查</a-tag>
                                </td>
                                <td v-if="!EmergencyManagementEMCHECKParams.urlinfo.value.type">
                                    <a-tag v-if="e.Period_4==true" color="green">已检查</a-tag>
                                    <a-tag v-else>未检查</a-tag>
                                </td>
                                <td>
                                    <a-radio-group :disabled="EmergencyManagementEMCHECKParams.urlinfo.value.type" v-model:value="e.Result">
                                        <a-radio :value="true">正常</a-radio>
                                        <a-radio :value="false">异常</a-radio>
                                    </a-radio-group>
                                </td>
                                <td>
                                    <a-input :disabled="EmergencyManagementEMCHECKParams.urlinfo.value.type" placeholder="请输入备注" v-model:value="e.Remark" style="width:200px" />
                                </td>
                                <td>
                                    <a-button v-on:click="EmergencyManagementEMCHECKParams.handleRecord(e)" type="link">记录</a-button>
                                </td>
                            </tr>
                        </table>

                    </a-card>
                    <a-form-item style="margin-top:10px" label-align="right" label="备注：">
                        <a-textarea style="width:600px" :disabled="EmergencyManagementEMCHECKParams.urlinfo.value.type==9" v-model:value="EmergencyManagementEMCHECKParams.sformData.value.Remark">
                        </a-textarea>
                    </a-form-item>
                    <a-form-item style="margin-top:20px" label="附件：">
                        <a-upload v-model:file-list="EmergencyManagementEMCHECKParams.uploadImg.value.fileList"
                                  action="#"
                                  multiple
                                  :item-render="EmergencyManagementEMCHECKParams.itemRender.value"
                                  v-on:change="EmergencyManagementEMCHECKParams.handleChange">
                            <a-button v-if="EmergencyManagementEMCHECKParams.uploadImg.value.fileList.length < 8 && EmergencyManagementEMCHECKParams.urlinfo.value.type!=9" type="primary">+ 点击上传</a-button>
                        </a-upload>
                    </a-form-item>

                </a-card>
            </header>
            <a-modal v-model:open="EmergencyManagementEMCHECKParams.popShow.value" width="80%" title="检查记录" v-on:ok="EmergencyManagementEMCHECKParams.popShow.value=false">
                <a-spin :spinning="EmergencyManagementEMCHECKParams.uploadLock.value" tip="加载中，请耐心等待..." />
                <div style="height:70vh;overflow-y:scroll">
                    <a-table style="margin-top:10px" :pagination="EmergencyManagementEMCHECKParams.pagination.value" :data-source="EmergencyManagementEMCHECKParams.dataSource.value" :columns="EmergencyManagementEMCHECKParams.columns.value">
                    </a-table>
                    </div>
            </a-modal>
            <m-bottom-btns></m-bottom-btns>
        </a-config-provider>
    </a-style-provider>
</div>
@section Js{
    <script src="~/bussiness/js/base/tailwind.js"></script>
    <script>
    </script>
    <script type="module">
        import Composition from '../../bussiness/js/pg/EmergencyManagement/EMCheck.js?v=@DateTime.Now.ToString("yyyyMMddHHmm")'
        import localeValues from '../../Bussiness/js/base/es/locale/zh_CN.js'
        singalApp('EmergencyManagementEMCHECK', Composition, localeValues)
    </script>
}
